.score-detail {
  background-color: #f6f7f8;
  width: 100%;
  overflow-y: auto;
  overflow-x: hidden;
  height: 100vh;

  .section {
    padding: 0;
    // background: #ffffff;

    .scroll-view-content {
      height: calc(100vh - 87px);
    }

    .score-detail-page {

      // 轮播图区域
      .banner-section {
        position: relative;
        height: 400rpx;
        overflow: hidden;

        .banner {
          height: 100%;
          width: 100%;

          .banner-content {
            width: 100%;
            height: 100%;
            position: relative;
            cursor: pointer;
            transition: transform 0.2s ease;

            &:active {
              transform: scale(0.98);
            }

            .banner-image {
              width: 100%;
              height: 100%;
              object-fit: cover;
            }
          }
        }

        .banner-overlay {
          position: absolute;
          top: 0;
          left: 0;
          right: 0;
          bottom: 0;
          background: linear-gradient(135deg, rgba(0, 0, 0, 0.3) 0%, rgba(0, 0, 0, 0.1) 100%);
          display: flex;
          flex-direction: column;
          justify-content: space-between;
          padding: 40rpx 32rpx;

          .banner-title {
            color: #ffffff;
            font-size: 48rpx;
            font-weight: bold;
            text-shadow: 0 2rpx 4rpx rgba(0, 0, 0, 0.3);
          }

          .banner-subtitle {
            color: #ffffff;
            font-size: 32rpx;
            opacity: 0.9;
            text-shadow: 0 2rpx 4rpx rgba(0, 0, 0, 0.3);
          }

          .group-picker {
            width: fit-content;
            position: absolute;
            right: 10rpx;
            bottom: 10rpx;
          }

          .banner-button {
            align-self: flex-end;
            background: rgba(0, 0, 0, 0.6);
            color: #ffffff;
            padding: 16rpx 24rpx;
            border-radius: 24rpx;
            font-size: 28rpx;
            display: flex;
            align-items: center;
            gap: 8rpx;

            .arrow {
              font-size: 24rpx;
            }
          }
        }
      }

      // 筛选标签区域
      .filter-section {
        padding: 24rpx 32rpx;
        background: #ffffff;
        border-bottom: 1rpx solid #f0f0f0;

        .filter-tabs {
          display: flex;
          gap: 16rpx;
          overflow-x: auto;

          .filter-tab {
            background: #f5f5f5;
            color: #666666;
            font-size: 28rpx;
            padding: 16rpx 32rpx;
            border-radius: 24rpx;
            white-space: nowrap;
            transition: all 0.3s ease;
            border: 2rpx solid transparent;

            &.active {
              background: #1D428A;
              color: #ffffff;
              border-color: #1D428A;
            }

            &:active {
              transform: scale(0.95);
            }
          }
        }
      }

      // 列表头部
      .list-header {
        display: flex;
        // background: #ffffff;
        padding:  24rpx;
		margin: 0 24rpx;
		box-sizing: border-box;
        border-bottom: 1rpx solid #f0f0f0;
        font-size: 28rpx;
        color: #666666;
        font-weight: 500;

        .header-item {
          flex: 1;
          text-align: center;

          &.rank {
            flex: 0.5;
			font-size: 30rpx;
			font-family: DIN Alternate, DIN Alternate-Bold;
			font-weight: 700;
			text-align: center;
			color: #121212;
          }

          &.athlete {
            flex: 1.5;
            text-align: center;
          }

          &.event {
            flex: 0.8;
          }

          &.score {
            flex: 1;
          }

          &.wind {
            flex: 0.8;
          }
        }
      }

      // 成绩列表
      .score-list {
        // background: #ffffff;

        .score-item {
          display: flex;
          align-items: center;
          padding: 24rpx 32rpx 0;
          border-bottom: 1rpx solid #f5f5f5;
          transition: background-color 0.2s ease;

          &:active {
            background-color: #f8f8f8;
          }

          // 排行区域
          .rank-section {
            flex: 0.5;
            display: flex;
            justify-content: center;
            align-items: center;

            .medal-icon {
              width: 60rpx;
              height: 60rpx;
              border-radius: 50%;
              display: flex;
              align-items: center;
              justify-content: center;
              font-weight: bold;
              font-size: 24rpx;

              &.medal-1 {
                background: linear-gradient(135deg, #FFD700 0%, #FFA500 100%);
                color: #ffffff;
              }

              &.medal-2 {
                background: linear-gradient(135deg, #C0C0C0 0%, #A0A0A0 100%);
                color: #ffffff;
              }

              &.medal-3 {
                background: linear-gradient(135deg, #CD7F32 0%, #B8860B 100%);
                color: #ffffff;
              }

              .medal-number {
                font-weight: bold;
              }
            }

            .rank-number {
              font-size: 32rpx;
              color: #333333;
              font-weight: 500;
            }
          }

          // 运动员信息区域
          .athlete-section {
            flex: 1.5;
            display: flex;
            align-items: center;
            gap: 16rpx;

            .athlete-avatar {
              width: 60rpx;
              height: 80rpx;
              // border-radius: 50%;
              object-fit: cover;
              // border: 2rpx solid #f0f0f0;
            }

            .athlete-info {
              flex: 1;

              .athlete-name {
                font-size: 26rpx;
                color: #121212;
                font-weight: bold;
                margin-bottom: 24rpx;
				text:nth-child(2){
					width: 60rpx;
					height: 32rpx;
					background: #213165;
					border-radius: 4rpx;
					font-size: 20rpx;
					font-family: PingFang SC, PingFang SC-Regular;
					font-weight: 400;
					text-align: center;
					line-height: 32rpx;
					color: #ffffff;
				}
              }

              .athlete-detail {
                font-size: 24rpx;
                color: #666666;
              }
			  .athlete-detail2{
				  font-size: 22rpx;
				  color: #86898C;
			  }
            }
          }

          // 项目区域
          .event-section {
            flex: 0.8;
            text-align: center;

            .event-name {
              font-size: 22rpx;
              color: #121212;
              font-weight: 400;
            }
          }

          // 成绩区域
          .score-section {
            flex: 1;
            text-align: center;
            display: flex;
            flex-direction: column;
            align-items: center;
            gap: 8rpx;

            .score-time {
              font-size: 22rpx;
              color: #121212;
              font-weight: bold;
            }

            .pb-tag {
              background: #333333;
              color: #ffffff;
              font-size: 20rpx;
              padding: 4rpx 12rpx;
              border-radius: 12rpx;
              font-weight: 500;
            }
          }

          // 风速区域
          .wind-section {
            flex: 0.8;
            text-align: center;

            .wind-speed {
              font-size: 24rpx;
              color: #666666;
            }
          }
        }
		
		.cjxp{
			width: 654rpx;
			height: 68rpx;
			background: #f8faff;
			border: 2rpx solid #213165;
			border-radius: 8rpx;
			font-size: 26rpx;
			font-family: PingFang SC, PingFang SC-Medium;
			font-weight: 500;
			text-align: center;
			color: #213165;
			line-height: 68rpx;
			letter-spacing: 0.16rpx;
			margin: 24rpx auto 0;
		}
      }

      // 加载更多
      .load-more {
        padding: 32rpx;
        text-align: center;
        background: #ffffff;
        color: #666666;
        font-size: 28rpx;

        &:active {
          background: #f8f8f8;
        }
      }
    }
  }
}

// 响应式设计
@media (max-width: 750rpx) {
  .score-detail {
    .section {
      .score-detail-page {
        .banner-section {
          height: 300rpx;

          .banner-overlay {
            padding: 24rpx 24rpx;

            .banner-title {
              font-size: 40rpx;
            }

            .banner-subtitle {
              font-size: 28rpx;
            }
          }
        }

        .filter-section {
          padding: 16rpx 24rpx;

          .filter-tabs {
            .filter-tab {
              font-size: 24rpx;
              padding: 12rpx 24rpx;
            }
          }
        }

        .list-header {
          padding: 16rpx 24rpx;
          font-size: 24rpx;
        }

        .score-list {
          .score-item {
            padding: 16rpx 24rpx;

            .athlete-section {
              .athlete-avatar {
                width: 60rpx;
                height: 60rpx;
              }

              .athlete-info {
                .athlete-name {
                  font-size: 28rpx;
                }

                .athlete-detail {
                  font-size: 20rpx;
                }
              }
            }

            .score-section {
              .score-time {
                font-size: 28rpx;
              }
            }
          }
        }
      }
    }
  }
}